<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>
	<p:dialog header="#{mensaje.titulo_proveedores}" widgetVar="dlgContact"
		resizable="false" closable="false" modal="true" appendTo="@(body)" dynamic="true">
		<h:form id="formContacto">
			<p:focus for="NombreContacto" />
			<h:panelGrid columns="2" style="margin-bottom:10px">
				<h:outputLabel for="NombreContacto" value="#{mensaje.label_nombre}" />
				<p:inputText id="NombreContacto"
					value="#{proveedorBean.contacto.nombre}" size="30" maxlength="30"
					required="true" requiredMessage="#{mensaje.error_nombre_contacto}" 
					validatorMessage="#{mensaje.error_text}">
					<f:validateRegex pattern="[a-z/ A-Z]+"/>
				</p:inputText>
				<h:outputLabel for="TelefonoContacto"
					value="#{mensaje.titulo_telefono}" />
				<p:inputText id="TelefonoContacto"
					value="#{proveedorBean.contacto.telefono}" size="30" maxlength="20"
					required="true"
					requiredMessage="#{mensaje.error_telefono_contacto}"
					validatorMessage="#{mensaje.error_numerico}">
					<f:validateRegex pattern="[0-9]+" />
				</p:inputText>
			</h:panelGrid>
			<p:commandButton id="addConctactButton" value="#{mensaje.action_guardar}" 
			    icon="ui-icon-disk"
			    action="#{proveedorBean.addNewContact()}"
				oncomplete="if (!args.validationFailed)PF('dlgContact').hide();"
				update=":formProveedores:tabView:formContactoPanel,:formContacto" />
			<p:commandButton id="cancelConctactButton" icon="ui-icon-circle-plus"
			    immediate="true" value="#{mensaje.action_cancelar}"
				oncomplete="PF('dlgContact').hide();"
				action = "#{proveedorBean.cancelarContact()}"
			>
				  <p:resetInput target="@form" />
			 </p:commandButton>

		</h:form>


	</p:dialog>
	<p:dialog header="#{mensaje.titulo_proveedores}" widgetVar="dlg"
		resizable="false" modal="true" appendTo="@(body)" width="1000"
		height="600" dynamic="true" closable="false">

		<h:form id="formProveedores">
			<h1>#{mensaje.titulo_proveedor}</h1>
			<p:commandButton action="#{proveedorBean.guardar()}"
				value="#{mensaje.action_guardar}" icon="ui-icon-disk"
				update="tabView" />

			<p:commandButton action="#{proveedorBean.cancelar()}"
				value="#{mensaje.action_cancelar}" immediate="true"
				icon="ui-icon-cancel"
				onclick="if (!args.validationFailed)PF('dlg').hide();">
				<p:resetInput target="@form" />
			</p:commandButton>

			<p:separator id="separator" />
			<br />
			<p:growl id="growl" autoUpdate="true" />
			<p:focus id="focus" />
			<p:tabView id="tabView">
				<p:tab id="tab1" title="#{mensaje.titulo_proveedor}">
					<f:facet name="header">#{mensaje.titulo_proveedor}</f:facet>
					<p:focus for="nombre" />

					<h:panelGrid columns="2">

						<p:outputLabel for="nombre"
							value="#{mensaje.titulo_proveedor_nombre}" />
						<p:inputText id="nombre" value="#{proveedorBean.proveedor.nombre}"
							required="true" size="50" maxlength="50" />

						<p:outputLabel for="direccion"
							value="#{mensaje.titulo_proveedor_direccion}" />
						<p:inputTextarea id="direccion"
							value="#{proveedorBean.proveedor.direccion}" required="true"
							rows="2" cols="50" size="50" maxlength="100" />

						<p:outputLabel value="#{mensaje.titulo_pais}" />
						<p:selectOneMenu effect="fade"
							value="#{proveedorBean.proveedor.ciudad.pais}"
							converter="#{paisConverter}" required="true"
							requiredMessage="#{mensaje.error_combo_pais}"
							valueChangeListener="#{proveedorBean.selectOneMenuListener}">
							<f:selectItem itemLabel="#{mensaje.label_seleccioneunvalor}"
								itemValue="#{_pais}" itemDisabled="true" />
							<f:selectItems value="#{paisList.findAll()}" var="_pais"
								itemLabel="#{_pais.nombre}" itemValue="#{_pais}" />
							<p:ajax update="ciudades" />
						</p:selectOneMenu>

						<p:outputLabel value="#{mensaje.titulo_ciudad} " />
						<p:selectOneMenu id="ciudades"
							value="#{proveedorBean.proveedor.ciudad}" effect="fade"
							converter="#{ciudadConverter}" required="true"
							requiredMessage="#{mensaje.error_combo_ciudad}">
							<f:selectItem itemLabel="#{mensaje.label_seleccioneunpais}"
								itemValue="#{_ciudad}" itemDisabled="true" />
							<f:selectItems value="#{proveedorBean.clCombo}" var="_ciudad"
								itemLabel="#{_ciudad.nombre}" itemValue="#{_ciudad}" />
						</p:selectOneMenu>

						<p:outputLabel for="fax" value="Fax" />
						<p:inputMask id="fax" value="#{proveedorBean.proveedor.fax}"
							mask="(999) 999-999" />

						<p:outputLabel for="tel" value="#{mensaje.titulo_telefono}" />
						<p:inputMask id="tel" value="#{proveedorBean.proveedor.telefono}"
							mask="(999) 999-999" required="true" />

						<p:outputLabel for="mail" value="#{mensaje.titulo_email}" />
						<p:inputText id="mail" value="#{proveedorBean.proveedor.email}"
							required="true"
							validatorMessage="#{mensaje.titulo_correoInvalido}">
							<f:validateRegex
								pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />
						</p:inputText>

						<p:outputLabel for="webSite" value="#{mensaje.titulo_sitioWeb}" />
						<p:inputText id="webSite"
							value="#{proveedorBean.proveedor.sitioWeb}" />

						<p:outputLabel for="observaciones"
							value="#{mensaje.titulo_observaciones}" />

						<p:inputTextarea id="observaciones" rows="5" cols="50"
							counter="counter"
							value="#{proveedorBean.proveedor.observaciones}" size="200"
							maxlength="200"
							counterTemplate="{0} #{mensaje.titulo_caracteres_sobrantes}" />
						<br />
						<h:outputText id="counter" />

						<p:watermark for="mail" value="Ej. lasca@gmail.com" />
						<p:watermark for="webSite" value="Ej. www.lasca.com.py" />

					</h:panelGrid>

				</p:tab>
				<p:tab id="tab2" title="#{mensaje.titulo_contactos}">
					<p:panel id="formContactoPanel">
						<p:commandButton id="openContactDialog" icon="ui-icon-document" 
						     value = "#{mensaje.action_nuevo}"
							onclick="PF('dlgContact').show()" immediate="true"
							update=":formContacto" />


						<p:separator id="separatorContact" />
						<h:outputLabel value="#{mensaje.titulo_listaDecontactos}"
							style="font-size:15px;font-weight:bold" />
						<br />
						<br />
						<p:dataTable id="contactosList"
							value="#{proveedorBean.proveedor.contactos}" var="_contacto"
							paginator="true" paginatorPosition="bottom" rows="5">

							<p:column sortBy="#{_contacto.nombre}"
								filterBy="#{_contacto.nombre}" width="10">
								<f:facet name="header">#{mensaje.label_nombre}</f:facet>
		                        #{_contacto.nombre}
		                     </p:column>
							<p:column sortBy="#{_contacto.telefono}"
								filterBy="#{_contacto.telefono}" width="10">
								<f:facet name="header">#{mensaje.titulo_telefono}</f:facet>
		                        #{_contacto.telefono}
		                     </p:column>
							<p:column width="10">
								<f:facet name="header">#{mensaje.label_opciones}</f:facet>
								<p:commandButton id="commandDel"
									action="#{proveedorBean.removeContact(_contacto)}"
									update=":formProveedores:tabView:contactosList"
									immediate="true" icon="ui-icon-closethick">
									<p:confirm header="Confirmation"
										message="#{mensaje.titulo_confirmacion_contacto}"
										icon="ui-icon-alert" />
								</p:commandButton>

								<p:tooltip for="commandDel" value="#{mensaje.action_eliminar}"
									showEffect="fade" hideEffect="fade" />
								<p:confirmDialog global="true" showEffect="fade">
									<p:commandButton value="#{mensaje.titulo_si}" type="button"
										styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
									<p:commandButton value="#{mensaje.titulo_no}" type="button"
										styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
								</p:confirmDialog>
								<p:commandButton id="commandMod"
									action="#{proveedorBean.setContactoAModificar(_contacto)}"
									icon="ui-icon-pencil" update=":formContacto"
									onclick="PF('dlgContact').show()"									
									immediate="true" />
								<p:tooltip for="commandMod" value="#{mensaje.action_modificar}"
									showEffect="fade" hideEffect="fade" />
							</p:column>
						</p:dataTable>
					</p:panel>
				</p:tab>
			</p:tabView>
			<br />
		</h:form>
	</p:dialog>
</h:body>
</html>
